<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:f="http://java.sun.com/jsf/core">
    <link rel="stylesheet" type="text/css" href="resources/css/style.css" />
    <h:head>

        <title>index</title>

    </h:head>

    <h:body>
        <div class="container">

            <div class="header">
                <div  class="sub-header-lateral">
                    <h:form>
                        <a href="./admin/admin.faces"> Accedi come amministratore </a>
                    </h:form>    
                </div> 	
                <div  class="sub-header-center"><h1><strong>Knights of Realm</strong></h1></div> 
                <div  class="sub-header-lateral">
                    <h:form>
                        <a href="./player/prova.faces"> Gioca </a>
                    </h:form>    
                </div>   		
            </div>

            <!-- Left starting-->
            <div class="left" style="margin-top:50px;"></div>
            <!-- Left end-->

            <!-- Main-content starting-->
            <div class="main-content" style="margin-top:50px;">
                <div class="sub-content">
                    <h:form>
                        <h2><h:outputText value="Registrazione"/></h2>
                        <table align="center">
                            <tr> 
                                <td><h:outputText value="Username:"/></td> 
                                <td><h:inputText id="username-input" label="username" value="#{signUpController.username}" required="true" requiredMessage="campo obbligatorio"/></td>
                                <td><h:message for="username-input"/></td>
                            </tr>
                            <tr> 
                                <td><h:outputText value="Password:"/></td> 
                                <td><h:inputSecret id="password-input" label="password" binding="#{passwordComponent}" value="#{signUpController.password}" required="true" requiredMessage="campo obbligatorio"/></td>
                                <td><h:message for="password-input"/></td>
                            </tr>
                            <tr> 
                                <td><h:outputText value="Ripeti password:"/></td> 
                                <td>
                                    <h:inputSecret id="rpassword-input" label="repeat password" value="#{signUpController.rpassword}" required="true" requiredMessage="campo obbligatorio">
                                        <f:validator validatorId="confirmPasswordValidator" />
                                        <f:attribute name="passwordComponent" value="#{passwordComponent}" />
                                    </h:inputSecret>
                                </td>
                                <td><h:message for="rpassword-input"/></td>
                            </tr>
                            <tr> 
                                <td><h:outputText value="Email"/></td>
                                <td><h:inputText id="email-input" label="email" value="#{signUpController.email}" required="true" requiredMessage="campo obbligatorio"/></td>    
                                <td><h:message for="email-input"/></td>
                            </tr>
                            <tr>
                                <td><h:commandButton value="Registra" action="#{signUpController.signUp()}"/></td>
                                <td><h:outputText value="#{signUpController.usernameMessage}"/></td>
                            </tr>
                        </table>
                    </h:form>
                </div>
            </div>
            <!--Main-content end -->
            <!-- Right starting-->
            <div class="right" style="margin-top:50px;"></div>
            <!-- Right end-->
        </div>    
        <!--Div Container end-->
    </h:body>      
</html>
